<template>
  <div class="content-wrapper">
  	<mt-header fixed title="我"></mt-header>
    <div class="content-wrapper-context">
      <div class="myhome-userimg">
        <div class="userimg-font">用户：{{userid}}</div>
        <img src="../../assets/logo.png" alt="">
      </div>
      <div>
        <div class="my-menu-item over-borderstyle" @click="getUserInfo">
          <img src="../../assets/images/resume48.png" alt="">
          个人信息
        </div>
        <div class="my-menu-item over-borderstyle">
          <img src="../../assets/images/truck.png" alt="">
          车辆信息
        </div>
        <div class="my-menu-item over-borderstyle last-borderstyle" @click="enterHazardInfo">
          <img src="../../assets/images/obstacle.png" alt="">
          障碍管理
        </div>
      </div>
      <div class="my-setting" >
        <div class="my-menu-item over-borderstyle last-borderstyle" @click="enterMysetting">
          <img src="../../assets/images/settings.png" alt="">
          设置
        </div>
      </div>
      <transition>
	      <router-view ></router-view>
	    </transition>
    </div>
  </div>
</template>

<script>
import axios from '@/api/axios';
import { mapGetters, mapMutations} from 'vuex';
import { Toast, MessageBox, Indicator} from 'mint-ui';
export default {
  data: function () {
     return {
       userid: this.getId(),
     }
  },
  methods:{
    ...mapGetters(['getId']),
    ...mapMutations(['setName']),
    ...mapMutations(['setSex']),
    ...mapMutations(['setCar']),
    ...mapMutations(['setYearTotal']),
    ...mapMutations(['setMonthTotal']),
    getUserInfo: function(){
      Indicator.open("加载中...");
      var setting = {
        method: 'POST',
        url: '/getUserInfoByPhone',
      };
      var setting2 = {
        method: 'post',
        url: '/getUserDeliveryTotal'
      }
      var data = { phone: this.userid };
      axios.call(this, (res) => { this.getUserInfoCallback(res) }, {setting: setting, data: data});
      axios.call(this, (res) => { this.getUserSaleInfoCallback(res); }, {setting: setting2, data: data})
    },
    getUserInfoCallback: function (res) {
      Indicator.close();
			if(res.code === 0) {
        this.userinfo = res.data;
        this.setName(this.userinfo.name);
        this.setSex(this.userinfo.sex);
        this.setCar(this.userinfo.truckid);
        this.$router.push({path: '/home/my/myhome'});
			}else {
        this.$toast('用户信息拉取失败');
			}
    },
    getUserSaleInfoCallback: function (res) {
      if(res.code === 0){
        console.log(res.data.yeartotal);
        this.setYearTotal(res.data.yeartotal);
        this.setMonthTotal(res.data.monthtotal);
      }else{
        this.setYearTotal(0);
        this.setMonthTotal(0);
      }
    },
    enterUserInfo: function () {
      this.$router.push({path: '/home/my/myhome'});
    },
    enterHazardInfo: function () {
      this.$router.push({path: '/home/my/myhazard'});
    },
    enterUserCarInfo: function (){
      this.$router.push({path: '/home/my/mycarinfo'});
    },
    enterMysetting: function () {
      this.$router.push({path: '/home/my/mysetting'});
    }
    //函数写在上面 ↑
  }
};
</script>

<style>
  @import '../../assets/css/mypages/my.css';
</style>
